require('./PageTenderplan.styl');
import { Storage } from 'clientConfig/util/StoreData';
import Addpersonfield from 'components/addpersonfield'
const { Group, TextField, SelectField, PhotoField, Icon, Button, DatetimeField, Toast } = SaltUI;
const reactMixin = require('react-mixin');
const Actions = require('./actions');
const Store = require('./store');

class Tenderplan extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            approvers: [],//审批人列表
            proName: '' || props.pagedata && props.pagedata.proj_name,
            proNum: '' || props.pagedata && props.pagedata.proj_num,
        };
        this.data = [
            { name: '项目申报书', startTime: 'applyStartTime', endTime: 'applyEndTime' },
            { name: '建设方案', startTime: 'constructStartTime', endTime: 'constructEndTime' },
            { name: '预算确认书', startTime: 'budgetStartTime', endTime: 'budgetEndTime' },
            { name: '采购文件', startTime: 'purchaseStartTime', endTime: 'purchaseEndTime' },
            { name: '评标报告', startTime: 'evaluatStartTime', endTime: 'evaluatEndTime' },
        ];
        if (props.pagedata) {
            // debugger
            let nodelists = props.pagedata.form_component_values.nodelists;
            for (let i = 0; i < this.data.length; i++) {
                if (this.data[i].startTime) {
                    this.state[this.data[i].startTime] = new Date(nodelists[i].node_info[0].value).getTime();
                }
                if (this.data[i].endTime) {
                    this.state[this.data[i].endTime] = new Date(nodelists[i].node_info[1].value).getTime();
                }
            }
            this.state.edit = props.edit;
            // this.state.approvers = props.pagedata.approvers;
        }
    }
    handleTextChange(name, newValue) {
        this.setState({
            [name]: newValue
        });
    }
    //时间选择器选择
    handleChange(name, value) {
        const fn = (item) => {
            return item.startTime == name || item.endTime == name;
        }
        let num = this.data.findIndex(fn);
        for (let j = 0; j < num; j++) {
            if (!this.state[this.data[j].startTime]) {
                Toast.show({
                    type: 'error',
                    content: `${this.data[j].name}开始时间不能为空`
                });
                return;
            }
            if (!this.state[this.data[j].endTime]) {
                Toast.show({
                    type: 'error',
                    content: `${this.data[j].name}结束时间不能为空`
                });
                return;
            }          
        }
        if (name.includes("StartTime")) {
            if (num >= 1 && value <= this.state[this.data[num - 1].endTime]) {
                Toast.show({
                    type: 'error',
                    content: `请重新选择`
                });
                return;
            }
            if (this.state[this.data[num].endTime] && value > this.state[this.data[num].endTime]) {
                Toast.show({
                    type: 'error',
                    content: `请重新选择`
                });
                return;
            }

        } else if (name.includes("EndTime")) {
            if (!this.state[this.data[num].startTime]) {
                Toast.show({
                    type: 'error',
                    content: `${this.data[num].name}开始时间未设置`
                });
                return;
            }
            if (value < this.state[this.data[num].startTime]) {
                Toast.show({
                    type: 'error',
                    content: `请重新选择`
                });
                return;
            }
            if (num <= this.data.length - 2 && this.state[this.data[num + 1].startTime] && value >= this.state[this.data[num + 1].startTime]) {
                Toast.show({
                    type: 'error',
                    content: `请重新选择`
                });
                return;
            }
        }
        this.setState({
            [name + '1']: new Date(value).toLocaleDateString(),
            [name]: value
        });
    }
    //提交按钮
    handleClick() {
        if (!this.state['proName']) {
            Toast.show({
                type: 'error',
                content: `项目名称不能为空`
            });
            return;
        } else if (!this.state['proNum']) {
            Toast.show({
                type: 'error',
                content: `项目编号不能为空`
            });
            return;
        }
        for (let i = 0; i < this.data.length; i++) {
            if (!this.state[this.data[i].startTime]) {
                Toast.show({
                    type: 'error',
                    content: `${this.data[i].name}开始时间不能为空`
                });
                return;
            }
        }
        if (this.state.approvers.length == 0) {
            Toast.show({
                type: 'error',
                content: `审批人不能为空`
            });
            return;
        }
        if (this.props.pagedata) {
            Actions.submit({ node: this.data, data: this.state, edit: this.state.edit, pagedata: this.props.pagedata });
        } else {
            Actions.submit({ node: this.data, data: this.state });
        }

    }
    handleAddpersonCb(names) {
        this.setState({ approvers: names })
        console.log(names)
    }
    handleAddpersonUnionid(ids){
        console.log(ids)
        this.setState({
            approvers_id: ids
        })
    }
    render() {
        let t = this;
        return (
            <div className="tenderplan myform">
                <Group.List >
                    <TextField
                        label="项目名称"
                        placeholder="请输入项目名称"
                        value={t.state.proName}
                        onChange={t.handleTextChange.bind(t, 'proName')}
                        readOnly={t.props.pagedata ? true : t.props.edit}
                    />
                </Group.List>
                <Group.List >
                    <TextField
                        label="项目编号"
                        placeholder="请输入项目编号"
                        value={t.state.proNum}
                        onChange={t.handleTextChange.bind(t, 'proNum')}
                        readOnly={t.props.pagedata ? true : t.props.edit}
                    />
                </Group.List>
                {this.data.map((item, index) => {
                    return <div>
                        <div className="timeTitle">{item.name}</div>
                        <Group.List>
                            <DatetimeField
                                label="开始时间"
                                readOnly={t.props.edit}
                                placeholder="请选择"
                                columns={['年', '月', '日']}
                                className="time"
                                value={this.state[item.startTime]}
                                onSelect={this.handleChange.bind(t, item.startTime)} />
                            <DatetimeField
                                label="结束时间"
                                placeholder="请选择"
                                columns={['年', '月', '日']}
                                className="time"
                                readOnly={t.props.edit}
                                value={this.state[item.endTime]}
                                onSelect={this.handleChange.bind(t, item.endTime)} />
                        </Group.List>
                    </div>
                })}
                <Addpersonfield
                    label="审批人"
                    cb={t.handleAddpersonCb.bind(t)}
                    union={t.handleAddpersonUnionid.bind(t)}
                    maxLength="3"
                    readOnly={t.props.edit}
                />
                <Button type="primary" className="submitBtn" onClick={t.handleClick.bind(t)}>提交</Button>
            </div>
        );
    }

    componentWillMount() {
    }

    componentDidMount() {
    }

    componentWillReceiveProps(nextProps) {
        this.setState({ edit: nextProps.edit })
    }

    shouldComponentUpdate(nextProps, nextState) {
        return true;
    }

    componentWillUpdate(nextProps, nextState) {
    }

    componentDidUpdate(prevProps, prevState) {
    }

    componentWillUnmount() {
    }
}

reactMixin.onClass(Tenderplan, Reflux.connect(Store));

module.exports = Tenderplan;
